﻿<!doctype html>
<html ng-app="app" >
<head>
    <meta charset="utf-8">
    <title>售卡-选择<span class="_typeName"></span></title>
    <link rel="stylesheet" href="../../../css/1920_1080/global.css"/>
    <link rel="stylesheet" href="../../../css/1920_1080/common.css"/>
    <link rel="stylesheet" href="../../../css/1920_1080/salecard.css"/>
    <style>
        .over {
            display: flex;
            justify-content: center;
            align-items: center;
            width: 100%;
            height: 100%;

            background: rgba(0, 0, 0, 0.5);
            color: #fff;
            font-size: 36px;

            position: relative;
        }
    </style>
    <script type="text/javascript" src="../../../js/frame/browser.js"></script>
    <script type="text/javascript" src="../../../js/frame/angular.min.js"></script>
</head>

<body ng-controller="controller">
<div class="container inner">
    <div class="indexbox">
        <div class="header">
            <div class="logo"><img src="../../../images/1920_1080/logo.png" width="176" height="87" alt="logo"></div>
            <div class="contact"><label>客服电话：</label><strong>0755-88692588</strong></div>
        </div>
        <div class="contentbox">
            <div class="bar bar1">
                <ul>
                    <li class="complete">选择<span class="_typeName"></span></li>
                    <li>付款</li>
                    <li>取走<span class="_typeName"></span></li>
                </ul>
            </div>
            <div class="mainbox choosebox" style="width:auto;display: flex;flex-wrap: wrap;justify-content: space-around;align-items: center" ng-cloak>
                <div ng-repeat="card in cardList"
                     style="height: 45%;{{cardList.length>4?'width:30%':'width:40%'}}" >
                    <div style="display: flex;flex-direction:column;justify-content: center;align-items: center;height: 100%;width: 100%;background: rgba(255, 255, 255, 0.5);"
                         voice-control="第{{zhIndex[$index]}}张,第{{zhIndex[$index]}}章" ng-click="clickCard(card)">
                        <img ng-src="{{imgUrl}}/{{card.FRONT}}" style="padding: 0;height: 70%;width: auto;">
                        <p style="white-space: nowrap;text-overflow: ellipsis;text-align:center;width: 100%;display: block;overflow: hidden;">{{card.CARDNAME}}</p>
                        <div style="display: flex;justify-content: center;align-items: center;">
                            <img style="max-width: 10px;max-height: 10px;" src="../../../images/horn.png">
                            <p style="font-size: 10px" class="ng-binding">第{{zhIndex[$index]}}张</p>
                        </div>
                    </div>
                    <div class="over" ng-if="card.isOver" style="{{cardList.length>4?'margin-top: -64%;':'margin-top: -48%;'}}">卖完了</div>
                </div>
            </div>
        </div>
        <div class="footer">
            <input type="button" value="首 页" name="exit" class="exit" voice-control="首页,退出"/>
            <input type="button" value="确 定" name="sure" style="display: none;" class="sure" voice-control="确定"/>
            <div class="timing">剩余操作时间：<span>90</span></div>
        </div>
    </div>
    <div class="banner">
        <ul></ul>
        <ol></ol>
        <i class="left"></i><i class="right"></i>
    </div>
</div>
</body>
</html>

<script src="../../../js/frame/jquery.min.js"></script>
<script src="../../../js/driver/BaseDriver.js"></script>
<script>
    Browser.relativeDirJs("../../../js/frame", "browser", "angular.min", "jquery.min", "BizService", "banner", "banner_total");
    Browser.relativeDirJs("../../../../personal/js");
    Browser.relativeDirJs("../../../js/driver", "BaseDriver", "CardPrintPos");
    Browser.relativeDirJs("../../../js/gateway");
    Browser.relativeDirJs("../../../js/biz/common");
</script>
<script src="../../../js/biz/salecard/step-1-choose-card.js"></script>